import * as echarts from '../../components/ec-canvas/echarts';

var globalData = require('../chartData');

// 将数据包装到echarts回调函数中
function wrapOption(option) {
  return function (canvas, width, height, dpr) {
    const chart = echarts.init(canvas, null, {
      width: width,
      height: height,
      devicePixelRatio: dpr // 像素比
    });
    canvas.setChart(chart);
    chart.setOption(option);
    return chart;
  }
}

// 获取表的配置信息
function getChartConfig(chartName){
   for (var e of globalData.chartConfig) {
     if(e.chartName === chartName){
       return e;
     }
   }
   return null;
}
// 通过tag获取其下面所有图表
function getChartListByTag(tagName){
    let chartNameList = getChartNameListByTag
    (tagName)
    let result = []
    for (var e of chartNameList) {
        var chartConfig = getChartConfig(e.chartName)
        result.push({chartName:e.chartName, ec:{onInit: wrapOption(chartConfig.option)},desc:chartConfig.desc})
    }
    return result;
}

// 获取一个tag下所有图表
function getChartNameListByTag(tagName){
  for (var x of globalData.treeConfig) {
    for(var y of x.tagList){
      if(y.tagName === tagName){
        return y.chartList;
      }
    }
  }
  return []
}

Page({
  data: {
    tabs: [],
    activeTab: 0,
    selectedTagList:[],
    selectedTagName:'',
    selectedChartList:[],
  },

  // 初始化tab，设置默认的tag
  onLoad(options){
    let tabs = globalData.treeConfig.map(item => ({title: item.tabName}))
    this.setData({tabs:tabs})
    this.setData({activeTab:0})
    this.setData({selectedTagList:globalData.treeConfig[0].tagList})
    this.setData({selectedTagName:this.data.selectedTagList[0].tagName})
    this.setData({selectedChartList:getChartListByTag(this.data.selectedTagName)})
  },

  // 切换激活的tab标签
  onTabClick(e) {
    const index = e.detail.index
    this.setData({activeTab: index})
    this.setData({selectedTagList:globalData.treeConfig[index].tagList})
    this.setData({selectedTagName:this.data.selectedTagList[0].tagName})
    this.setData({selectedChartList:getChartListByTag(this.data.selectedTagName)})
  },

  // 切换tag
  onTagClick(event){ 
    this.setData({selectedTagName:event.currentTarget.dataset.chartName})
    this.setData({selectedChartList:getChartListByTag(this.data.selectedTagName)})
  },

  // 点击图表
  onChartClick(event){
    wx.navigateTo({
      url: '/pages/chart/chart?chartName='+event.currentTarget.dataset.chartName,
    })
  },

  onLongTab(event){
    let c = this.selectComponent('mychart-dom-bar')
    c.s
      wx.showModal({
        title: 'xx',
        content: 'xx',
        complete: (res) => {
          if (res.cancel) {
            
          }
      
          if (res.confirm) {
            
          }
        }
      })
  }
})
